<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Calendar Demo</title>
		<link href="../css/qs.css" rel="stylesheet" type="text/css" />
		<link href="../css/qs_ui.css" rel="stylesheet" type="text/css" />	
		<script src="../lib/jquery.js"></script>
		<script src="../js/ui/calendar.js"></script>
	</head>
	<body>
		<input id="date1" type="text" style="position:absolute;top:100px;left:200px;">
		<input id="date2" type="text" style="position:absolute;top:100px;left:500px;">
		<div class="container"></div>
		<div class="container1"></div>
		<script>
			function formateNum(d){
				return d<10?("0"+d):d;
			}
			function format(date){
				return date.getFullYear()+"-"+formateNum(date.getMonth()+1)+"-"+formateNum(date.getDate());
			}
			var calendar=new Util.Calendar($('.container'),{
			},{autoHide:true
			});
			var calendar1=new Util.Calendar($('.container1'),function(date){},{
			});
			calendar.register($('#date1')[0],function(date){
				$('#date1').val(format(date));
			});
			calendar.register($('#date2')[0],function(date){
				$('#date2').val(format(date));
			});
			$('#date1').click(function(e){
				calendar.show($('#date1')[0],$('#date1').val());
			});
			$('#date2').click(function(e){
				calendar.show($('#date2')[0],$('#date2').val());
			});
		</script>
	</body>
</html>
